<template>
	<view class="address">
		<!-- 头部 -->
		<!-- <u-navbar back-icon-color="#000000" :title="type==1 ? '选择地址':'家庭地址'" title-color="#3F3F3F" :title-bold="true" :background="background"></u-navbar> -->
		<u-navbar :back-text="type==1 ? '选择地址':'家庭地址'" :back-text-style="textStyle" back-icon-color="#000000" style="font-weight: bold;font-family: PingFang SC;"></u-navbar>
		<!-- end -->
		<!-- 列表 -->
		<mescroll-body top="0" :down="downOption" :up="upOption" :height="comHeight"  ref="mescrollRef" @init="mescrollInit" @down="downCallback">
			<view  v-if="address.length!==0">
				<view class="list" v-for="(item,index) in address" :key="index" :data-id="item.addressId" @click="address_act(item.addressId,index)">
					<view class="name">
						<view class="addres">
							<image v-show="type==1" class="fr" src="../../static/icon/gou.png" mode="widthFix" v-if=" tIndex == item.addressId"></image>
							<image v-show="type==1" class="fr" src="../../static/icon/nochecked.png" mode="widthFix" v-else ></image>
							
							<view class="phone">
								<view class="phs">{{item.contactsName}}</view>
								<view>{{item.contactsPhone}}</view>
							</view>
						</view>
						<view class="shouhuo">
							<view class="saddres">收货地址：</view>
							<view class="province">
								{{item.province}}{{item.city}}{{item.region}}{{item.address}}
							</view>
						</view>
					</view>
					<view class="lin"></view>
					<view class="a_foot">
						<view class="moren" v-if="item.defaultFlag">默认地址</view>
						<view class="moren" v-else @click.stop="setdefault(item)">设为默认地址</view>
						<view>
							<image src="../../static/icon/edit.png" mode="" style="padding-right: 46rpx;"
							 @click.stop="chang_add(item,index)"></image>
							<image src="../../static/icon/del.png" mode="" @click.stop="del_add(item)"></image>
						</view>
					</view>
				</view>
				
				<view style="margin-top: 50rpx;">
					<u-divider color="#DEDEDE" half-width="120" border-color="#DEDEDE">{{prompt}}</u-divider>
				</view>
			</view>
			
			<view  style="margin-top: 100rpx;text-align: center;" v-else >
				<image src="../../static/img/1-36.png" style="width: 450rpx;height: 450rpx;"></image>
				<view class="typeface1">暂无数据</view>
			</view>
		</mescroll-body>
		<!-- end -->
		<u-toast ref="uToast" />
		<!-- 按钮 -->
		<view @click="addAddress()" class="butttom">
			新建地址
		</view>
		<!-- end -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				background:{
					backgroundColor: '#fca800',
				},
				title: '我的地址',
				address: [],
				isShow: false,
				pageSize: 10,
				page: 1,
				prompt:'加载中...',
				tIndex:'',
				downOption: {
					use: false,
					auto: false
				},
				upOption: {
					use: false
				},
				mescroll: null,
				type:0,//0:家庭地址进入    1：选择地址进入
				addressId:'',
				selectAddress:{},//保存添加地址
				addAddressType:0,//0:当前页面不操作    1：返回立即下单页面
				comHeight:0,
				clickIndex:0,
			};
		},
		onReachBottom(){
			this.page+=1;
			this.getAddressList();
		},
		onLoad(option) {
			var that=this;
			   var menuButtonInfo = uni.getMenuButtonBoundingClientRect();
			   const { top, width, height, right } = menuButtonInfo;
			   uni.getSystemInfo({
			    success: res => {
			     const { statusBarHeight } = res;
			     const margin = top - statusBarHeight;
			     var navHeight = height + statusBarHeight + margin * 4;
			     that.comHeight = res.windowHeight * 2 - navHeight*2-146;
			    }
			   });
			console.log(option.type,"type")
			if(option.type){
				this.type=option.type;
			}
			this.page=1;
			this.address=[];
			this.prompt='加载中...';
			this.getAddressList();
		},
		onShow() {
			if(this.addAddressType==1){
				this.page=1;
				this.address=[];
				this.prompt='加载中...';
				this.getAddressList();
			}
		},
		methods: {
			mescrollInit(mescroll) {
				this.mescroll = mescroll;
			},
			//选择地址
			address_act(addressId,index) {
				this.clickIndex=index
				this.tIndex = addressId;
				if(this.type==1){
					let pages = getCurrentPages();  //获取所有页面栈实例列表
					let prevPage = pages[ pages.length - 2 ];  //上一页页面实例
					prevPage.$vm.page = 1;
					prevPage.$vm.address = this.address[index];
					console.log(prevPage.$vm.address)
					setTimeout(function(){
						uni.navigateBack({
							delta:1
						})
					},500)
				}else if(this.type==2){
					// 新下单预约页面返回操作
					let pages = getCurrentPages();  //获取所有页面栈实例列表
					let prevPage = pages[ pages.length - 2 ];  //上一页页面实例
					prevPage.$vm.isRefresh = 1;
					prevPage.$vm.addressId = addressId;
					setTimeout(function(){
						uni.navigateBack({
							delta:1
						})
					},500)
				}
			},
			addAddress(){
				uni.navigateTo({
					url:'./addAddress?type='+this.type
				})
			},
			setdefault:function(e){
			
				let opts = {
					way: true, //true JSON请求；false 表单请求
					method: 'post',
					url: 'user-address/setDefault'
				};
				let data = {
					addressId: e.addressId
				};
				this.http.httpTokenRequest(opts, data).then(res => {
					if(res.code=="200"){
						this.$refs.uToast.show({
							title: res.message,
							type: 'success'
						})
						this.page=1;
						this.address=[];
						this.prompt='加载中...';
						this.getAddressList();
					}else{
						this.$refs.uToast.show({
							title: res.message,
							type: 'error'
						})
					}
				});
				
			},
			del_add(e) {
				uni.showModal({
					title: '',
					content: '确定要删除该地址吗？',
					cancelColor: '#F29423',
					confirmColor: '#979797',
					success: res => {
						if (res.confirm) {
							let opts = {
								way: true, //true JSON请求；false 表单请求
								method: 'post',
								url: 'user-address/del'
							};
							let data = {
								addressId: e.addressId
							};
							this.http.httpTokenRequest(opts, data).then(res => {
								if(res.code=="200"){
									this.$refs.uToast.show({
										title: res.message,
										type: 'success'
									})
									this.page=1;
									this.address=[];
									this.prompt='加载中...';
									this.getAddressList();
								}else{
									this.$refs.uToast.show({
										title: res.message,
										type: 'error'
									})
								}
							});
						} 
					}
				})
			},
			chang_add(e,index) {
				var _this = this
				_this.clickIndex=index
				uni.navigateTo({
					url: '/pageageA/personal/addAddress?id=' + e.addressId+'&type='+this.type
				})
			},
			getAddressList:function(){
				let opts = {
					way: true, //true JSON请求；false 表单请求
					method: 'post',
					url: 'user-address/page'
				};
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				let data = {
					page: this.page,
					pageSize: this.pageSize
				};
				this.http.httpTokenRequest(opts, data).then(res => {
					//打印请求返回的数据  
					uni.hideLoading();
					if(res.code=="200"){
						if (res.data.records.length > 0 || this.page != 1) {
							this.isShow = false;
							if (res.data.current * res.data.size < res.data.total) {
								for (const key in res.data.records) {
									this.address.push(res.data.records[key]);
								}
								this.prompt = '加载中....';
							} else {
								for (const key in res.data.records) {
									this.address.push(res.data.records[key]);
								}
								this.prompt = '没有更多了';
							}
							// if(this.addAddressType==1){
							// 	let pages = getCurrentPages();  //获取所有页面栈实例列表
							// 	let prevPage = pages[ pages.length - 2 ];  //上一页页面实例
							// 	prevPage.$vm.page = 1;
							// 	prevPage.$vm.address = this.address[this.clickIndex];
							// 	console.log(prevPage.$vm.address)
							// 	setTimeout(function(){
							// 		uni.navigateBack({
							// 			delta:1
							// 		})
							// 	},500)
							// }
						} else {
							this.isShow = true;
						}
					}else{
						this.$refs.uToast.show({
							title: res.message,
							type: 'error'
						})
					}
					
				});
			}
		}
	};
</script>

<style scoped lang="scss">
	.typeface1{
		margin-top: 10rpx;
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #666666;
		opacity: 1;
	}
	// 内容
	.list{
		padding: 0 20rpx;
		border-bottom: 10rpx solid #E8E8E8;
	}
	.name{
		padding: 40rpx 20rpx 20rpx 20rpx;color:#707070;font-weight: 400;
	}
	.addres{
		display: flex;
	}
	.addres .fr{
		width: 30rpx;height: 30rpx;
	}
	.addres .phone{
		display: flex;justify-content: space-between;padding-left: 20rpx;font-size: 30rpx;
	}
	.phone .phs{
		width: 170rpx;
	}
	.shouhuo{
		padding:16rpx 0rpx 0rpx 20rpx;display: flex;
	}
	.saddres{
		font-size: 26rpx;width: 150rpx;
	}
	.province{
		font-size: 26rpx;
	}
	.lin{
		border-bottom: 2rpx solid #E8E8E8;
	}
	.a_foot{
		display: flex;justify-content: space-between; padding: 20rpx 54rpx 20rpx 40rpx;
	}
	.moren{
		font-size: 26rpx;color: #F29423;
	}
	.a_foot image{
		width: 34rpx;height: 40rpx;
	}
	.but{
		text-align: center;padding-top: 80rpx;
	}
	.butttom{
		width: 642rpx;
		height: 72rpx;
		line-height: 72rpx;
		background: #FCA800;
		opacity: 1;
		border-radius: 48rpx;
		text-align: center;
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
		opacity: 1;
		position: fixed;
		z-index: 2;
		bottom: 74rpx;
		left: 54rpx;
	}
	
</style>
